<template>
  <van-tabbar v-model="active"
              fixed>
    <van-tabbar-item icon="home-o"
                     to="/home"
                     name="home">首页</van-tabbar-item>
    <van-tabbar-item icon="search"
                     to="/detail"
                     name="detail">详情</van-tabbar-item>
    <van-tabbar-item icon="friends-o"
                     to="/about"
                     name="about">关于</van-tabbar-item>
    <van-tabbar-item icon="setting-o"
                     to="/address"
                     name="address">地址</van-tabbar-item>
  </van-tabbar>
</template>
<script>
import { Tabbar, TabbarItem } from 'vant';
export default {
  name: 'app-footer',
  data () {
    return {
      active: 'home'
    }
  },
  components: {
    [Tabbar.name]: Tabbar,
    [TabbarItem.name]: TabbarItem
  }
}
</script>